const CompressionPlugin = require('compression-webpack-plugin'),
    productionGzipExtensions = [
        "js",
        "css",
        "svg",
        "woff",
        "ttf",
        "json",
        "html"
    ],
    path = require('path');

const resolve = dir => path.join(__dirname, dir);

const devConfig = {
    /* 启动配置 */
    devServer: {
        open: true,
        inline: true,
        hot: true,
        host: 'localhost',
        // host: '192.168.1.108',
        port: 9990,
        https: false,
    },
}

const commonConfig = {
    /* 别名/图片转Base64 */
    chainWebpack: config => {
    config.resolve.alias
        .set('styles', resolve('./src/assets/css'))
        .set('images', resolve('./src/assets/img'))
        .set('comps', resolve('./src/components'))
        .set('static', resolve('./src/assets'))
        .set('views', resolve('./src/views'))
        .set('apis', resolve('./src/api'))
    config.module
        .rule('images')
        .use('url-loader')
        .loader('url-loader')
        .tap(options => Object.assign(options, {
            limit: 20000
        }))
        .end()
    config.module
        .rule('svg')
        .exclude.add(resolve('src/assets/img/svg'))
        .end()
    config.module
        .rule('icons')
        .test(/\.svg$/)
        .include.add(resolve('src/assets/img/svg'))
        .end()
        .use('svg-sprite-loader')
        .loader('svg-sprite-loader')
        .options({
            symbolId: 'icon-[name]',
        })
        .end()
    },
}

const defaultConfig = {
    /* 文件压缩配置 */
    configureWebpack: {
        plugins: [
            new CompressionPlugin({
                filename: "[path].gz[query]",
                test: new RegExp("\\.(" + productionGzipExtensions.join("|") + ")$"),
                threshold: 1024,
                minRatio: 0.8,
                deleteOriginalAssets: false
            })
        ],
    },
    productionSourceMap: false
}

module.exports = {
    ...devConfig,
    ...commonConfig,
    ...defaultConfig
}